<template>
	<div class="layout-padding">
		<div class="layout-padding-auto layout-padding-view">

			<div class="drafts">
				<div class="draftsTitle">草稿箱</div>
				<div class="draftsList">
					<div class="draftsDom">

						<div class="draftsDomText">
							<div class="draftsDomTitle">草稿1</div>
							<div class="draftsImg">
								<img src="" alt=""></img>
								<div>
									<h4>标题XXXXXXXXXXXXXXXXXXXXXXX</h4>
									<p>描述XXXXXXXXXXXXXXXXXXXXXXXXXXXX </p>
									<p class="draftsTime">2025-07-01 12:00:00</p>
								</div>
							</div>

						</div>
						<div class="draftsDetails">详情</div>
					</div>
					<div class="draftsDom">
						<div class="draftsDomText">
							<div class="draftsDomTitle">草稿2</div>
							<div class="draftsImg">
								<img src="" alt=""></img>
								<div>
									<h4>标题XXXXXXXXXXXXXXXXXXXXXXX</h4>
									<p>描述XXXXXXXXXXXXXXXXXXXXXXXXXXXX </p>
									<p class="draftsTime">2025-07-01 12:00:00</p>
								</div>
							</div>

						</div>

						<div class="draftsDetails">详情</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	data() {
		return {
			formDialogRef: '',
			excelUploadRef: '',
			queryForm: {},
			dataList: [],
			loading: false,
			pagination:null,
			queryParams:{}
		};
	},
	created() {},
	mounted() {},
	methods: {
		handleDelete() {},
		handleSelectionChange() {},
		exportExcel() {},
	},
};
</script>
<style lang="scss" scoped>
.draftsTitle {
	border-bottom: 1px solid #e3e3e3;
	padding: 15px 20px;
	font-size: 18px;
}

.draftsDom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	margin: 20px 0;
	font-size: 15px;

	border: 1px solid #e3e3e3;
	padding-bottom: 20px;
	position: relative;

	h4 {
		font-size: 18px;
		margin-bottom: 5px;
		color: #333;
	}

	p {
		color: #666;
	}

	.draftsDomTitle {
		margin-right: 20px;
	}

	.draftsImg {
		display: flex;
	}

	.draftsDomText {
		display: flex;
		align-items: center;
	}

	img {
		width: 100px;
		min-height: 140px;
		background-color: #e3e3e3;
		margin-right: 20px;
	}

	.draftsDetails {
		color: #2e5cf6;
		cursor: pointer;
	}

	.draftsTime {
		position: absolute;
		bottom: 20px;
	}
}

.draftsDom:hover {
	background-color: #f9f9f9;
}
</style>
